<template>
    <div>
        <div v-for="item in pipi">
            <van-swipe-cell>
                <van-card :price="item.goods.goods_price" :title="item.goods.goods_name">
                    <template #tags>
                        <van-checkbox v-model="checked">复选框</van-checkbox>
                        <img src="" alt="">
                    </template>
                    <template #footer>
                        <van-stepper v-model="value" theme="round" button-size="22" disable-input />
                    </template>
                </van-card>
                <template #right>
                    <van-button @click="del(item.id)" square text="删除" style="height: 100%;" type="danger"
                        class="delete-button" />
                </template>
            </van-swipe-cell>
            <van-submit-bar :price="3050" button-text="提交订单" @submit="onSubmit">
                <van-checkbox v-model="checkedAll">全选</van-checkbox>
                <template #tip>
                    你的收货地址不支持配送, <span @click="onClickLink">修改地址</span>
                </template>
            </van-submit-bar>
        </div>
    </div>
</template>

<script setup>
import { useCounterStore } from '@/stores/counter'
// 在组件内部的任何地方均可以访问变量 `store` ✨
const store = useCounterStore()

import { ref } from 'vue';
let pipi = ref([])
let lala = () => {
    pipi.value = store.counter
}
lala()

// 购物车删除
console.log(store.counter);
const del = (id) => {
    store.counter = store.counter.filter(item => item.id !== id)
    lala()
}

</script>

<style lang="scss" scoped></style>